<template>
  <el-col :span="22" :offset="1">
    <el-card>
      <el-table
        :data="Salary"
        style="width: 100%"
        max-height="370">
        <el-table-column
          fixed
          prop="sId"
          label="员工id"
          width="auto">
        </el-table-column>
        <el-table-column
          prop="pId"
          label="项目id"
          width="auto">
        </el-table-column>
        <el-table-column
          prop="sQuality"
          label="完成质量"
          width="155">
        </el-table-column>
        <el-table-column
          prop="sCheckIn"
          label="考勤"
          width="155">
        </el-table-column>
        <el-table-column
          prop="sSalaryTime"
          label="发放时间"
          width="auto">
        </el-table-column>
        <el-table-column
          prop="sEvaluation"
          label="工资评价"
          width="90">
        </el-table-column>
        <el-table-column
          prop="sStatus"
          label="结算状态"
          width="90">
        </el-table-column>
        <el-table-column
          label=""
          width="50">
          <template slot-scope="scope">
            <el-button type="text" size="small" @click="handleEdit(scope.$index,Salary)">编辑</el-button>
          </template>
        </el-table-column>

        <el-table-column
          label=""
          width="50">
          <template slot-scope="scope">
            <el-button type="text" size="small" @click="deleteRow(scope.$index,Salary)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
      <template>
        <el-dialog title="修改工资信息"  width="40%" :visible.sync="dialogFormVisible">
          <el-form ref="form" :model="form" label-width="100px">
            <el-form-item size="small" label="工作质量">
              <el-input size="small" v-model="form.sQuality"></el-input>
            </el-form-item>
            <el-form-item size="small" label="考勤">
              <el-input size="small" v-model="form.sCheckIn"></el-input>
            </el-form-item>
            <el-form-item size="small" label="发放时间">
              <el-input size="small" v-model="form.sSalaryTime"></el-input>
            </el-form-item>

            <el-form-item size="small" label="评价">
              <el-input size="small" v-model="form.sEvaluation"></el-input>
            </el-form-item>
            <el-form-item size="small" label="发放状态">
              <el-input size="small" v-model="form.sStatus"></el-input>
            </el-form-item>
          </el-form>

          <div slot="footer" class="dialog-footer">
            <el-button @click="dialogFormVisible = false">取消</el-button>
            <el-button type="primary" @click="saveEdit">确认修改</el-button>
            <!--                <el-button type="primary" @click="dialogFormVisible = false">确认修改</el-button>-->
          </div>
        </el-dialog>
      </template>
    </el-card>
    <el-card style="margin-top: 10px">
      <el-button type="info" style="margin-left: 10px" @click="print">打印工资报表</el-button>
    </el-card>
  </el-col>
</template>

<script>
  import Global from '../../utils/global'
  var Status = ['未结算','已结算']
  export default {
    name: 'SalaryManageSuper',
    data(){
      return{
        glo:new Global,
        Salary:[],
        idx:-1,
        form:{
          pId:null,
          sId:null,
          sQuality: null,
          sCheckIn: null,
          sEvaluation: null,
          sSalaryTime:null,
          sStatus: null,
        },
        input4search:'',
        dialogFormVisible: false,
      }
    },
    methods:{
      print(){
        var timestamp = (new Date()).valueOf();
        var token = md5("epms" + timestamp);
        window.open("http://47.92.227.185:8080/download/salarylogCsv?token="+token+"&timestamp="+timestamp)
        // var data = {}
        // this.glo.sendDate(this.glo.server+'download/wageCsv',data,null,"POST")
      },
      handleResDel(res){
        console.log(res)
        let feedBack = eval(res);
        console.log(feedBack)
        if (feedBack.code == 20000) {
          this.$message.success(`删除成功`);
          this.Salary.splice(index, 1);
        }else{
          this.$message.error(`删除失败`);
          location.reload()
        }
      },
      deleteRow(index, Salary) {
        this.idx = index;
        var data = Salary[index]
        this.glo.sendDate(this.glo.server + "super/delSalary", data, this.handleResDel,"POST")
      },
      filterByPro(value, row, column){
        const property = column['property'];
        return row[property] === value;
      },
      handleEdit(index,Salary) {
        if(Salary[index].sStatus == "已结算"){
          this.$message.error("已结算的工资不可修改")
          return;
        }
        this.idx = index;
        this.formnp = Salary[index];
        // console.log(projects[index]);
        this.dialogFormVisible = true;
        // this.glo.sendDate(this.glo.server + "frontDesk/getAllClient", data, this.handleRes,"POST")
      },
      saveEdit() {
        // this.projects[this.idx] = this.form;
        var salary = this.form

        // console.log(this.form)
        if(salary.sStatus=="已结算"){
          salary.sStatus = 1
        }else if(salary.sStatus=="未结算"){
          salary.sStatus = 0
        }
        console.log(salary)
        this.glo.sendDate(this.glo.server + "admin/updateSalary", salary, this.handleResEdit,"POST")
        this.dialogFormVisible = false;
      },
      handleResEdit(res){
        console.log(res)
        let feedBack = eval(res);
        console.log(feedBack)
        if (feedBack.code == 20000) {
          this.$message.success(`第 ${this.idx + 1} 行记录修改成功`);
          location.reload()
        }else{
          this.$message.error(`修改失败`);
          location.reload()
        }
      },
      inserTable (line) {
        this.Salary.push(
          {
            sId: line.sId,
            pId:line.pId,
            sQuality:line.sQuality,
            sCheckIn:line.sCheckIn,
            sSalaryTime:line.sSalaryTime,
            sEvaluation:line.sEvaluation,
            sStatus:Status[line.sStatus],
          }
        )
      },
      initSalaryPage (res) {
        console.log(res)
        for (var line in res.data.salaryList){
          this.inserTable(res.data.salaryList[line])
        }
        console.log(this.tableData)

      },
      handleRes (res) {
        console.log(res);
        let feedBack = eval(res);
        if (feedBack.success == false) {//登录失败
          this.$message("工资列表获取失败");
          return;
        }
        this.$message.success("工资列表获取成功^^")
        this.initSalaryPage(feedBack)
      },
    },
    mounted(){
      let data = {
        sId:JSON.parse(sessionStorage.getItem('StaffInfo')).sId
      }
      this.glo.sendDate(this.glo.server+'admin/getAllSalary',data,this.handleRes,"POST")
    },
  }
</script>

<style scoped>

</style>
